
<template>
  <div class="import">
    <a-modal v-model="visible" title="导入数据" @cancel="handleCancel" width="450px" :maskClosable="false">
      <a-upload-dragger
        :file-list="fileList"
        :multiple="false"
        :before-upload="beforeUpload"
        :remove="removeFile"
        :maxCount="1">
        <p class="ant-upload-drag-icon">
          <a-icon type="inbox" />
        </p>
        <p class="ant-upload-hint">
          仅允许导入xls、xlsx格式文件
        </p>
      </a-upload-dragger>
      <template slot="footer">
        <a-button key="back" @click="handleCancel">
          关闭
        </a-button>
        <a-button type="primary" :visible="visibleBtn" :loading="loadingBtn" @click="handleOk">
          确定
        </a-button>
      </template>
    </a-modal>

  </div>
</template>
<script>

export default {
    data () {
        return {
            visible: false,
            fileList: [],
            visibleBtn: false,
            loadingBtn: false
        }
    },
    methods: {
        exportData () {
            this.visible = true
        },
        async handleOk () {
            if (this.fileList.length === 0) {
                this.$message.error('请选择要上传的文件')
            } else {
                this.loadingBtn = true
                this.visibleBtn = true

                // const data = await WelfareApi.importExcelData(this.data)
                // this.$message.success(data.message)
                // this.visible = false;
                // this.fileList = []
                // this.$emit('fatherMethod');
            }
        },
        handleCancel () {
            this.fileList = []
            this.visible = false
            this.loadingBtn = false
            this.visibleBtn = false
        },
        // 文件上传前的钩子
        beforeUpload (file) {
            console.log(file)
            // const isXslx =
            //     file.type ===
            //     "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" || file.type === "application/vnd.ms-excel";
            const isXslx = file.type === 'text/csv'
            const isLt2M = file.size / 1024 / 1024 < 2
            if (!isXslx) {
                this.$message.error('附件格式错误，请删除后重新上传！')
            }
            if (isXslx) {
                if (this.fileList.length == 0) {
                    this.fileList = [...this.fileList, file]
                    // this.importfxx(this.fileList);
                } else {
                    this.$message.error('仅能选择一个文件进行上传!')
                }
            }
            if (!isLt2M) {
                this.$message.error('上传文件大小不能超过 2MB!')
            }
            return false
        },
        removeFile (file) {
            const index = this.fileList.indexOf(file)
            const newFileList = this.fileList.slice()
            newFileList.splice(index, 1)
            this.fileList = newFileList
        },
        importfxx (obj) {
            const _this = this
            const inputDOM = this.$refs.inputer
            // 通过DOM取文件数据

            this.file = event.currentTarget.files[0]

            const rABS = false // 是否将文件读取为二进制字符串
            const f = this.file

            const reader = new FileReader()
            FileReader.prototype.readAsBinaryString = function (f) {
                let binary = ''
                const rABS = false // 是否将文件读取为二进制字符串
                const pt = this
                let wb // 读取完成的数据
                let outdata
                const reader = new FileReader()
                reader.onload = function (e) {
                    const bytes = new Uint8Array(reader.result)
                    const length = bytes.byteLength
                    for (let i = 0; i < length; i++) {
                        binary += String.fromCharCode(bytes[i])
                    }
                    // 此处引入，用于解析excel
                    const XLSX = require('xlsx')
                    if (rABS) {
                        wb = XLSX.read(btoa(fixdata(binary)), {
                            // 手动转化
                            type: 'base64'
                        })
                    } else {
                        wb = XLSX.read(binary, {
                            type: 'binary'
                        })
                    }
                    outdata = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]])
                    // outdata就是读取的数据（不包含标题行即表头，表头会作为对象的下标）
                    // 此处可对数据进行处理
                    const arr = []
                    outdata.map(v => {
                        const obj = {}
                        obj.id = v['序号']
                        obj.dpStage = v['DP班号']
                        obj.traineeName = v['学员姓名']
                        obj.name = v['收货人姓名']
                        obj.mobile = v['收货人电话']
                        obj.province = v['省']
                        obj.city = v['市']
                        obj.district = v['区']
                        obj.detailAddr = v['详细地址']
                        obj.expressName = v['快递名称']
                        obj.expressNumber = v['快递编号']
                        obj.expressTime = v['发货时间']
                        obj.statusName = v['状态']
                        arr.push(obj)
                    })
                    _this.data = arr
                    _this.dalen = arr.length
                    return arr
                }
                reader.readAsArrayBuffer(f)
            }
            if (rABS) {
                reader.readAsArrayBuffer(f)
            } else {
                reader.readAsBinaryString(f)
            }
        }
    }
}
</script>
